<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/resrt.css">
    <link rel="stylesheet" href="../css/footer.css">
    <link rel="stylesheet" href="../iconfont/iconfont.css">
    <title>Document</title>

</head>

<body>
    <div class="footer">
        <div class="site_footer">
            <div class="footer-service w">
                <ul class="list-service">
                    <li>
                        <a href="#">
                            <span class="iconfont icon-lianxikefu"></span>
                            预约维修服务
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="iconfont icon-7"></span>
                            7天无理由退货
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="iconfont icon-15tianwuliyoutuihuo"></span>
                            15天免费换货
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="iconfont icon-liwu1"></span>
                            满69元包邮
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="iconfont icon-map"></span>
                            520余家售后网点
                        </a>
                    </li>
                </ul>
            </div>


            <div class="footer-links w">
                <ul>
                    <li>帮助中心</li>
                    <li><a href="#">账户管理</a></li>
                    <li><a href="#">购物指南</a></li>
                    <li><a href="#">订单操作</a></li>
                </ul>

                <ul>
                    <li>服务支持</li>
                    <li><a href="#">售后政策</a></li>
                    <li><a href="#">自助服务</a></li>
                    <li><a href="#">相关下载</a></li>
                </ul>

                <ul>
                    <li>线下门店</li>
                    <li><a href="#">小米之家</a></li>
                    <li><a href="#">服务网点</a></li>
                    <li><a href="#">授权体验店/专区</a></li>
                </ul>

                <ul>
                    <li>关于小米</li>
                    <li><a href="#">了解小米</a></li>
                    <li><a href="#">加入小米</a></li>
                    <li><a href="#">投资者关系</a></li>
                    <li><a href="#">企业社会责任</a></li>
                    <li><a href="#">廉洁举报</a></li>
                </ul>

                <ul>
                    <li>关注我们</li>
                    <li><a href="#">新浪微博</a></li>
                    <li><a href="#">官方微信</a></li>
                    <li><a href="#">联系我们</a></li>
                    <li><a href="#">公益基金会</a></li>
                </ul>

                <ul>
                    <li>特色服务</li>
                    <li><a href="#">F 码通道</a></li>
                    <li><a href="#">礼物码</a></li>
                    <li><a href="#">防伪查询</a></li>
                </ul>


                <div class="col-contact">
                    <h3>400-100-5678</h3>
                    <p>8:00-18:00（仅收市话费）</p>
                    <a href="#" id="people_serive">
                        <span class="iconfont icon-daipingjia"></span>
                        人工服务
                    </a>
                    <div class="follow">
                        关注小米：
                        <img src="../img/wb.png" alt="" class="vb">
                        <img src="../img/wx.png" alt="" class="wx">
                    </div>
                    <img src="../img/wx-img.png" alt="" class="vx-img">

                </div>

            </div>
        </div>


        <div class="info_footer">
            <div class="container_footer w">
                <div class="footer_logo">
                    <img src="../img/logo-mi2.png" alt="">
                </div>
                <div class="info-text">
                    <p>
                        <a rel="nofollow" href="//www.mi.com/index.html" target="_blank">小米商城</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//www.miui.com/" target="_blank">MIUI</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//home.mi.com/index.html" target="_blank">米家</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="http://www.miliao.com/" target="_blank">米聊</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//www.duokan.com/" target="_blank">多看</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//game.xiaomi.com/" target="_blank">游戏</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//b.mi.com/?client_id=180100031058&masid=17409.0358"
                            target="_blank">政企服务</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//xiaomi.tmall.com/" target="_blank">小米天猫店</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//privacy.mi.com/all/zh_CN/" target="_blank">小米集团隐私政策</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//cdn.cnbj1.fds.api.mi-img.com/mi-mall/f516fe9e2c01.html"
                            target="_blank">小米公司儿童信息保护规则</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//m.mi.com/support/module?id=63&headless=1" target="_blank">小米商城隐私政策</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//www.mi.com/aptitude/list?id=62" target="_blank">小米商城用户协议</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="//static.mi.com/feedback/" target="_blank">问题反馈</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="javascript:void(0);" class="J_siteGlobalRegion">Select Location</a><br>

                        <a rel="nofollow" href="http://www.mi.com/beihu" target="_blank">北京互联网法院法律服务工作站</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="http://www.cca.org.cn/" target="_blank">中国消费者协会</a>
                        <span class="sep">|</span>
                        <a rel="nofollow" href="http://www.bj315.org/" target="_blank">北京市消费者协会</a>
                    </p>

                   
                    <p>
                       ©
                        <a href="javascript:;" target="_blank" title="mi.com">mi.com</a> 京ICP证110507号
                        <a href="http://beian.miit.gov.cn/" target="_blank" rel="nofollow">京ICP备10046444号</a>
                        <a rel="nofollow" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802020134" target="_blank">京公网安备11010802020134号</a>
                        <a href="//www.mi.com/culture-license/" target="_blank">京网文[2020]0276-042号</a>
                        <br>
                        <a href="//www.mi.com/medical/record/" target="_blank">（京）网械平台备字（2018）第00005号</a>
                        <a href="//www.mi.com/medical/qualification/" target="_blank">互联网药品信息服务资格证 (京)-非经营性-2014-0090</a>
                        <a href="//www.mi.com/business-license/" target="_blank">营业执照</a>
                        <a href="//www.mi.com/medical/list/" target="_blank">医疗器械质量公告</a>
                        <br>
                        <a href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/e0c7d4cf3b7cd88de10196e30c92e020.png" target="_blank">增值电信业务许可证</a>&nbsp;网络食品经营备案 京食药网食备202010048 &nbsp;
                        <a href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/c6859168166651511897f54fa1047fe3.png" target="_blank">食品经营许可证</a>
                        <br>
                        违法和不良信息举报电话：171-5104-4404&nbsp;<a href='https://www.mi.com/intellectual' target="_blank">知识产权侵权投诉</a>&nbsp;本网站所列数据，除特殊说明，所有数据均出自我司实验室测试
                    </p>

                    <p>
                        <img src="../img/truste.png" alt="">
                        <img src="../img/v-logo-2.png" alt="">
                        <img src="../img/icon3.png" alt="">
                        <img src="../img/footer4.png" alt="">
                        <img src="../img/footer5.png" alt="">
                    </p>
                </div>

            </div>
            <div class="footer-word w"><img src="../img/slogan2020.png" alt=""></div>
        </div>
    </div>
</body>

</html>
<script src="../js/jquery.js"></script>
<script>
    // 鼠标滑动到微信的小图标上的效果
    let Vx=document.querySelector(".wx");
    let vx_img=document.querySelector(".vx-img")
    Vx.addEventListener('mouseenter',function() {
        Vx.style.cursor="pointer";
        Vx.style.backgroundColor="#ff6700"
        vx_img.style.display="block";
    })
    Vx.addEventListener('mouseleave',function() {
        Vx.style.backgroundColor=""
        vx_img.style.display="none";
    })

    // 鼠标滑倒微博上面
let Vb = document.querySelector(".vb");
Vb.addEventListener('mouseenter',function() {
    Vb.style.backgroundColor="#ff6700"
})
Vb.addEventListener('mouseleave',function() {
    Vb.style.backgroundColor=""
})

// 人工服务部分
let people_serive=document.querySelector("#people_serive");
people_serive.addEventListener('mouseenter',function() {
    people_serive.style.color="white";
    people_serive.style.backgroundColor="#ff6700";
})

people_serive.addEventListener('mouseleave',function() {
    people_serive.style.color="#ff6700";
    people_serive.style.backgroundColor="";
})







// Jquery
// 当鼠标滑过a的时候让其变色
$(".list-service>li>a").on('mouseenter',function() {
    $(this).css("color","#ff6700").siblings().find(".list-service>li>a").css("color","")
})
$(".list-service>li>a").on('mouseleave',function() {
    $(this).css("color","")
})



$(".footer-links>ul>li>a").on('mouseenter',function() {
    $(this).css("color","#ff6700").siblings().find(".footer-links>ul>li>a").css("color","")
})
$(".footer-links>ul>li>a").on('mouseleave',function() {
    $(this).css("color","")
})


// 最底部的滑过a进行变色
$(".info-text>p>a").on('mouseenter',function() {
    $(this).css("color","#ff6700").siblings(".info-text>p>a").css("color","")
})
$(".info-text>p>a").on('mouseleave',function() {
    $(this).css("color","")
})
</script>